<template>
  <div>
    <d-banner></d-banner>
    <d-nav></d-nav>
    <div class="row" v-for="(theme, index) in themeList" :key="'theme-'+index">
      <div class="row-header">
        <span class="title"></span>
      </div>
      <div class="row-body">
        <div class="col-header">
          <div class="pattern"><img :src="theme.icon" :alt="theme.name"></div>
          <div class="title">{{theme.name}}</div>
          <div class="subtitle">{{theme.abstracts}}</div>
          <div class="trigger">
            <button class="btn" type="button" @click="accessList(theme.id,theme.name)">
              <span class="text">查看全部</span>
            </button>
          </div>
        </div>
        <div class="col-body"></div>
      </div>
    </div>
    <d-footer></d-footer>
  </div>
</template>

<script>
import Banner from "@/components/Banner";
import Nav from "@/components/Nav";
import Footer from "@/components/Footer";
import axios from "axios";
import { __URLHEAD } from "../config/global";

//axios.defaults.withCredentials = true;

export default {
  name: "",
  data() {
    return {
      username:null,
      themeList: []
    };
  },
  components: {
    "d-banner": Banner,
    "d-nav": Nav,
    "d-footer": Footer
  },
  created() {
    this.loginStatusDetect();
  },
  mounted() {},
  methods: {
    loginStatusDetect() {
      debugger
      let { username = null } = this.$store.state;
      this.username = username;
      if (!username) {
        this.$router.push({
          name: "Login",
          params: {}
        });
      } else {
        this.loadRowData();
      }
    },
    loadRowData() {
      axios.get(__URLHEAD + "getThemeListByID", {
          params: {
            userName:this.username || sessionStorage.username,
            //token:this.$store.getters.getUserToken,
            HTTEST: "test"
          }
        })
        .then(res => {
          let json = res.data;
          this.List = json.Data.tableList;
        });
    }
  }
};
</script>

<style scoped>
</style>